import Vue from "vue";
import App from "./App.vue";

import router from "./router"

import store from './store'

import ElementUI from "element-ui";
import "element-ui/lib/theme-chalk/index.css";

import "./assets/reset.css";
import "./assets/my.css";
import "./assets/customIcon.css"

// 进度条
import NProgress from 'nprogress';
import 'nprogress/nprogress.css';
NProgress.configure({
	showSpinner: false
});


// 字典
import moment from "moment"
import directive from './directive' // directive
Vue.use(directive)

import {selectDictLabel,selectDictLabels} from "@/utils/dict/dictUtil";


// 字典数据组件
import DictData from '@/components/DictData'
DictData.install()

//引入所有组件
const myComponents = require.context('./components', true, /\.vue$/);
myComponents.keys().forEach((key) => {
	const component = myComponents(key).default;
	Vue.component(component.name, component);
})
//引入所有工具类
const myUtils = require.context('./utils', true, /\.js/);
myUtils.keys().forEach((key) => {
	const myUtil = myUtils(key).default;
	if (typeof(myUtil) != 'undefined' && myUtil.hasOwnProperty("name")) {
		Vue.prototype['$' + myUtil.name] = myUtil
	}
})

//引入api
import api from "./api/api.js"
Vue.prototype.$api = api

//引入时间工具
Vue.prototype.$moment = moment

//json解析器
import JsonViewer from 'vue-json-viewer'
Vue.use(JsonViewer)

Vue.prototype.selectDictLabel = selectDictLabel
Vue.prototype.selectDictLabels = selectDictLabels

//权限
Vue.directive('has', {
	// 当被绑定的元素插入到 DOM 中时……
	inserted: (el, binding) => {
		// el 当前绑定的元素 binding.value指令的绑定值
		let permissionList = sessionStorage.getItem('permission_button');
		if (permissionList) {
			if (!permissionList.includes('super')) {
				// 判断一下是否包含这个元素，如果不包含的话，那就让他爸爸元素把子元素扔进垃圾堆
				if (!permissionList.includes(binding.value)) {
					el.parentNode.removeChild(el)
				}
			}

		}

	}
})
//计算表格高度，以便不超出屏幕
Vue.directive('resize', {
	// 当被绑定的元素插入到 DOM 中时……
	inserted: (el, binding) => {
		let height = ""
			
		function isResize() {
			// 可根据需求，调整内部代码，利用binding.value返回即可
			const style = document.defaultView.getComputedStyle(el)
			console.error("style.height",style.height)
			if (height !== style.height) {
				// 此处关键代码，通过此处代码将数据进行返回，从而做到自适应
				binding.value({
					height: style.height
				})
			}
			height = style.height
		}
		console.info("Vue.directive-inserted")
		isResize()
		// 设置调用函数的延时，间隔过短会消耗过多资源。
		//这里只需要调用一次即可
		// el.__vueSetInterval__ = setInterval(isResize, 100)
	},
	unbind: (el) => {
		// clearInterval(el.__vueSetInterval__)
	}
})

//使用UI库
Vue.use(ElementUI, {
	size: 'small', 
	zIndex: 3000
});

Vue.config.productionTip = false;

const app = new Vue({
	router,
	render: (h) => h(App),
	store,
	mounted() {},
	methods: {}
})
app.$mount("#app");
